<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>拿破仑系列蛋糕</title>
    <link rel="stylesheet" href="../css/bootstrap.css">
    <script src="../js/jquery.min.js"></script>
    <script src="../js/popper.min.js"></script>
    <script src="../js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="../css/nav.css">
    <link rel="stylesheet" href="../css/napoleon.css">
    <link rel="stylesheet" href="../footer.css">
 
    <style>
        @media screen and (min-width: 1200px){
.container {
    max-width: 100%;
}
}
.navigation-bar-bottom {
    margin-left: 121px;
    text-align: center;
}
  .pr-7{
      padding-right: 10rem;
  }

  @media screen and (max-width:1000px) {
     .disnone{
          display:none !important;
      }
  } 
@media screen and (max-width:767px) {
  .disnone_sm{
    display: none !important;
  }
}    
  .disable::before{
    content: "";
    display: table;
  }
  .disableafter::after{
    content: "";
    display: table;
  }
    </style>
</head>
<body>
  <div class="container px-0">

        <div class="navigation-bar row mx-0">
                <div class="logo-box col-lg-2">
                    <img src="../logo.png" alt="">
                </div>
             <div class="col-lg-10 px-0 "> 

               <div class="navigation-bar-top">
                <div class="row mx-0 pr-7 disnone">  
                  <div class="wallbox-wallcenter">
                       <!-- /* 这是购物车那一栏 */ -->
                    <div class=" col-sm-12 px-0">  
                      <div class="wallbox-walltop">
   
                          <div class="shopping-box">
                               <!-- 购物车盒子 -->
                                  <ul>
                                      <li><a href="">
                                          <img src="../shopping.png" alt="" class="gowuche">
                                          购物车
                                       </a></li>
                                      <li><a href="../login.html" target="_blank">登录</a></li>
                                      <li><a href="../cake-reg.html" target="_blank">注册</a></li>
                                  </ul>
                            

                          </div>
                      </div>
                    </div> 

                  <div class="col-md-12 px-0">  
                      <div class="wallbox-wallbottom">
                       <!-- 四个导航栏模块  -->
                          <div class="navigation-bar-bottom">
                             <ul>
                                 <li class="underline">
                                     <a href="../CAKE.html">Nos Produits<br>
                                               <span> 全部产品</span>
                                               </a>  
                                               </li>
                                 <li class="border1">
                                     <a href="">Napoléon<br>
                                 <span>拿破仑系列</span> 
                                    </a>
                                </li>
                                 <li class="border2">
                                    <a href="">Événements<br>
                                 <span>热门活动</span> 
                                   </a>
                                   <ul class="sub">
                                      <li><a href="">银行活动</a> </li>
                                      <li><a href="">最新活动</a> </li>
                                  </ul>
                               </li>
                                 <li>
                                       <a href="">Mon M'CAKE<br>
                                    <span>会员中心</span>  
                                      </a>
                               </li>
                             </ul>
                             <div class="phone">
                                <div class="phone-box">
                                    <div> 
                                        <img src="../电话.png" alt=""> 
                                        <span><a href="#">4006-123-099</a> </span>
                                    </div>
                                    <div>
                                           <img src="../laba.png" alt=""> 
                                           <span class="pei"><a href="#">配送范围查询</a></span>
                                 </div>
                                </div>
                                <!-- 地标 -->
                              <div class="sites">
                                   <ul class="site">
                                       <li class="border3">
                                       <img src="../地址.png" alt="">
                                           <a href="">上海市 </a> 
                                           <ul class="dizhi">
                                              <li>北京市</li>
                                              <li>杭州市</li>
                                              <li>苏州市</li>
                                              <li>成都市</li>
                                          </ul>   
                                       </li>
                                   </ul>                               
                               </div>            
                             </div>
                          </div>                
                      </div>
                     </div> 


                  </div> 
                </div>        
               </div>
             </div>  
            </div>
      
 

<!-- 导航栏结束    -->

<div class="inner_box">
  <div class="xunwei">
   <img src="../napoleon_img/xunwei_03.png" alt="">
  </div> 
  <div class="napoleon">
      <img src="../napoleon_img/Napoleon.png" alt="">
  </div>


 <div class="pro_raw_list row mx-0 ">
     <div class=" col-sm-4">
     <a href="#">
       <img src="../napoleon_img/Vanilla_wz_01.png" alt="">  
     </a>
     <p>经典香草拿破仑</p>
    </div>
     <div class=" col-sm-4">
         <a href="#">
     <img src="../napoleon_img/Blueberry_wz_01.png" alt="">
        
     </a>
      <p>蓝莓经典拿破仑</p> 
    </div>
     <div class=" col-sm-4">
         <a href="#">
            <img src="../napoleon_img/Vanilla_wz_01.png" alt="">      
        </a>
      <p>经典香草拿破仑</p>
    </div>

 </div>


<div class="n_btn">
    <a href="#">
    <img src="../napoleon_img/Secret.png" alt="">
   </a>
</div>
</div>

<div class="row px-0">
    <div class="big_img_bg disable col-sm-12">
       <!-- 商品图片信息 按钮触发事件   -->
       <img src="../napoleon_img/Blueberry.jpg" alt="">
     <div class="Blueberry_Button">
    <span data-toggle="we">
        <img src="../napoleon_img/Blueberry_Button.png" alt="">
    </span>
     </div>
    
    </div>
    
    </div>


<div id="we" class="py-5 row mx-0 ">
  <div class="col-sm-12 px-0">
     <div class="row w-75 show_box mx-0">
  <div class="col-lg-6 col-sm-12 show_box_height px-0 ">
     <div class="show_box_bg">
       <img src="../napoleon_img/Pro_lm.png" alt="">
     </div>
 
  </div>
 
  <div class="col-lg-6 col-sm-12 show_box_height px-0  pt-5">
    <div class="bluemei">
      <a href="#we">
        <img src="../napoleon_img/Blueberry_wz_02 (1).png" alt="">
        <p>蓝莓轻乳拿破仑</p>
      </a>
</div>

<div class="click_buy">
  <p>Myrtilles fraiches, bio, feuilletage au goût de beurre frais, marmelade de myrtilles, crème chantilly, et tout celà dans le plaisir du palais .</p>
  <p>
      精选野生蓝莓的清爽可口/芝士的香浓/优质奶油的醇厚</p>
      <p>
          起酥皮的香脆可口/内层轻乳芝士的松软 层层美味/回味无穷
      </p>
      <button class="btn btn-danger mt-4 zindex-1">+ 点击购买  Click to buy +</button>
       <a href=""><div class="Blueberry_right"></div></a>


  </div>
    </div>
 </div>
</div>


</div>


<!-- 第二块大图 -->
<div class="row px-0">
  <div class="big_img_bg disable col-sm-12">
     <!-- 商品图片信息 按钮触发事件   -->
     <img src="../napoleon_img/Vanilla.jpg" alt="">
   <div class="Blueberry_Button">
  <span data-toggle="we2">
      <img src="../napoleon_img/Vanilla_Botton_.png" alt="">
  </span>
   </div>
  
  </div>
  
  </div>


<div id="we2" class="py-5 row mx-0 ">
<div class="col-sm-12 px-0">
   <div class="row w-75 show_box mx-0">
<div class="col-lg-7 col-sm-12 show_box_height px-0 ">
   <div class="show_box_bg">
     <img src="../napoleon_img/Pro_xc.png" alt="">
   </div>

</div>

<div class="col-lg-5 col-sm-12 show_box_height px-0  pt-5">
  <div class="xiangcao">
    <a href="#we2">
      <img src="../napoleon_img/Blueberry_wz_02 (1).png" alt="">
      <p>蓝莓轻乳拿破仑</p>
    </a>
</div>

<div class="click_buy_two">
<p>
  Avec un style typiquement français, ce gâteau unique vous laissera des souvenirs Napoléoniens...</p>
<p>
   
  法国风味/香浓绵甜的吉士酱/芝士的香浓/优质奶油的醇厚</p>
    <p>
        起酥皮的香脆可口/
        入口即化/层层美味
    /回味无穷
    </p>
    <button class="btn btn-danger mt-4 zindex-1">+ 点击购买  Click to buy +</button>
     <a href=""><div class="Blueberry_two_right"></div></a>


</div>
  </div>
</div>
</div>


</div>

<!-- 底部的三块图片 -->

<div class="Naturals row mx-0 px-0 ">
 <div class="col-sm-10 mr_auto">
   <div class="row mx-0 px-0">
      <div class="col-sm-12">
        <h4>拿破仑酥皮的秘密 <img src="../napoleon_img/Footer_fw.png" alt=""></h4>
        
      </div>    
      <div class="col-sm-12"><p class="h7">GMP制药标准的5°C恒温车间实现对制作温度的把握，借鉴法国酥皮工艺，在多层酥皮之间上演味蕾的惊喜</p> </div>    
      <div class="col-sm-12 px-0 my-4">
           <div class="row mx-0 px-0 justify-content-around">
             <div class="col-lg-4 col-sm-12"><img src="../napoleon_img/napoleon_pro_01.jpg" alt=""></div>
             <div class="col-lg-4 col-sm-12"><img src="../napoleon_img/napoleon_pro_02.jpg" alt=""></div>
             <div class="col-lg-4 col-sm-12"><img src="../napoleon_img/napoleon_pro_03.jpg" alt=""></div>
           </div>

      </div>    
   </div>
 </div>
</div>

<!-- footer部分 -->
<div class="footer_box">
 
  <div class="footer-wallbox row mx-0 w-md-100 px-0 mr_auto">
    <div class="col-lg-5 col-md-12 px-0">
    <div class="m_copy">
      <p class="icp_no">客服热线：4006-678-678（8:00 - 22:00）</p>
      <p>客服邮箱：cs@mcake.com</p>
    </div>
  </div>
    <div class="col-lg-7 col-md-12 px-0">
    <div class="foot_nav">
       <div class="discover">
         <h4 class="discover-ico">发现</h4>
         <p>公告</p>
         <p class="wb-wb"></p>
         <p class="wx-wx"></p>
       </div>
       <dl class="footer-dl">
         <dt>关于我们</dt>
         <dd>企业介绍</dd>
         <dd>媒体合作</dd>
         <dd>招贤纳士</dd>
         <dd>呼叫中心</dd>
       </dl>
       <dl class="footer-dl">
         <dt>帮助中心</dt>
         <dd>投诉与建议</dd>
         <dd>会员权益</dd>
         <dd>购物指南</dd>
         <dd>支付类</dd>
         <dd>订单相关</dd>
         <dd>配送服务</dd>
       </dl>
    </div>
  </div>
 
 



<div class="copyright col-lg-12 px-0 fs-12 mt-5">

     <div class="row mx-0 ">
       <div class="col-lg-4 col-md-6 col-sm-12 px-0">
         <p class="longleft">上海卡法电子商务有限公司</p>
         <p class="long">地址：上海市普陀区同普路1130弄3号楼</p>
         <p>电话：021-52691591</p>
         <p>社会信用代码：913101070678091460</p>
         <p>食品经营许可证：JY13101070034251</p>
         <p>食品生产许可证：SC12431010700121</p>
       </div>
       <div class="col-lg-4 col-md-6 col-sm-12 px-0">
        <p class="longleft">上海卡法电子商务有限公司</p>
        <p class="long">地址：上海市普陀区同普路1130弄3号楼</p>
        <p>电话：021-52691591</p>
        <p>社会信用代码：913101070678091460</p>
        <p>食品经营许可证：JY13101070034251</p>
      </div>
      <div class="col-lg-4 col-md-6 col-sm-12 px-0">
        <p class="longleft">上海卡法电子商务有限公司</p>
        <p class="long">地址：上海市普陀区同普路1130弄3号楼</p>
        <p>电话：021-52691591</p>
        <p>社会信用代码：913101070678091460</p>
        <p>食品经营许可证：JY13101070034251</p>
      </div>
     
     </div>
  
   <div class="text-center w-100">Copyright © 2012-2019 上海卡法电子商务有限公司 版权所有
    </div>
</div>
</div>


</div>
</div>

<script>
  $("[data-toggle=we]").click(function(){
    //让#target瞬间显示隐藏: 
  //    $("#target").hide();
    //让#target过度显示隐藏:
  // $("#target").show();
  $("#we")
    // .toggle(1000)	
  //使用上滑下滑代替显示/隐藏效果
  .fadeToggle(600)
  //使用淡入淡出代替显示/隐藏效果
    // .slideToggle(500)
  });
  
  $("[data-toggle=we2]").click(function(){
  $("#we2")
  .fadeToggle(600);
  });
  
  </script>
</body>
</html>